<script setup>
import {ref} from "vue";
import {useRouter} from "vue-router";
import {useAuth} from "../services/auth.service.js";
import UserService from "../services/user.service.js";

const { setUser } = useAuth()
const router = useRouter()

const emailModel = ref('')
const passwordModel = ref('')
const rememberModel = ref('')
const factor2Model = ref('')

const login = () => {

  UserService.login(emailModel.value, passwordModel.value, factor2Model.value).then((response, error) => {
    if (response.data.access_token) {
      setUser(response.data, rememberModel)
    }
    router.push({ name: "Dashboard" })
  })
}
</script>

<template>
<div style="display: flex; align-items: center; justify-content: center; flex-direction: column;">
  <h3>Аутентификация и авторизация</h3>
  <div style="width: 400px;">
    E-mail<br>
    <input type="text" v-model="emailModel"><br><br>

    Password<br>
    <input type="password" v-model="passwordModel"><br><br>

    <input type="checkbox" v-model="rememberModel" /> Запомнить меня<br><br>

    <button @click="login">Войти</button>
  </div>
</div>
</template>

<style scoped>

</style>